react、vue

2024-07-09 12:22| 来源: 网络整理| 查看: 265

从点击屏幕上的元素到触发元素的点击（click）事件的过程中，移动端浏览器大约有300毫秒的等待时间，主要是想看后面是否还会再做点击操作（是否要进行双击操作）,而fastclick.js就是为了解决这个问题。下面我来说一下使用方法：

1、fastclick在react上的使用方式：

（1）安装：

npm install --save fastclick

（2）使用：（写在全局的index.js文件中，直接作用于整个项目）

import React from 'react'; import ReactDOM from 'react-dom'; import App from './App.js'; // 引入 fastclick import fastclick from 'fastclick'; // 解决点击事件延迟300毫秒的问题 fastclick.attach(document.body); ReactDOM.render(,document.getElementById('root'));

2、fastclick在vue上的使用方式：

（1）安装：

npm install --save fastclick

（2）使用：（写在全局的main.js文件中，直接作用于整个项目）

import Vue from 'vue'; import App from './App'; import router from './router'; import Axios from 'axios'; // 引入 fastclick import fastclick from 'fastclick'; // 解决点击事件延迟300毫秒的问题 fastclick.attach(document.body); new Vue({ el: '#app', router, Axios, store, components: {App}, template: '' });

综上述，在vue中的使用方式和在react中的使用方式是一样的。

3、fastclick在js上的使用方式：

（1）在HTML页面中添加

注意：要在引入其他（脚本）文件之前引入fastclick.js文件

（2）在JS中使用fastclick的做法：

if ('addEventListener' in document) { document.addEventListener('DOMContentLoaded', function() { FastClick.attach(document.body); }, false); }

（3）在JQ中使用fastclick的做法：

$(function() { FastClick.attach(document.body); });

【转载】原文链接：https://blog.csdn.net/LiaoFengJi/article/details/100152484?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-3.control&depth_1-utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-3.control

【本文地址】

公司简介

联系我们